<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	    <title>购物车加减</title>
	<style>
	*{margin:0;padding:0;}
	body{width:100px;margin:100px auto;}
	
	.gw_num{border: 1px solid #dbdbdb;width: 110px;line-height: 26px;overflow: hidden;}
	.gw_num em{display: block;height: 26px;width: 26px;float: left;color: #7A7979;border-right: 1px solid #dbdbdb;text-align: center;cursor: pointer;font-style:normal;}
	.gw_num .num{display: block;float: left;text-align: center;width: 52px;font-style: normal;font-size: 14px;line-height: 24px;border: 0;}
	.gw_num em.add{float: right;border-right: 0;border-left: 1px solid #dbdbdb;}
	</style>
	</head>
	<body>
		<div class="gw_num">
			<em class="jian">-</em>
			<input type="text" value="1" class="num"/>
			<em class="add">+</em>
		</div>
	</body>
	<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js" ></script>
	<script type="text/javascript">
		$(document).ready(function(){
			//加的效果
			$(".add").click(function(){
			var n=$(this).prev().val();
			var num=parseInt(n)+1;
			if(num==0){ return;}
			$(this).prev().val(num);
			});
			//减的效果
			$(".jian").click(function(){
			var n=$(this).next().val();
			var num=parseInt(n)-1;
			if(num==0){ return}
			$(this).next().val(num);
			});
		})
	</script>
</html>
